<template>
    <div class="mine">
        <div>
            <label for="nickname">用户昵称：</label>
            <input id="nickname" type="text" v-model="form.nickname" />
        </div>

        <div>
            <label for="age">用户年龄：</label>
            <input id="age" type="text" v-model="form.age" />
        </div>

        <div>
            <button @click="changeInfo">修改</button>
            <button @click="logout">退出登录</button>
        </div>
    </div>
</template>

<script>
export default {
    mounted() {
        let user = JSON.parse(window.sessionStorage.getItem('user'));
        if (user) {
            this.form.nickname = user.nickname;
            this.form.age = user.age;
        }
    },
    data() {
        return {
            form: {
                nickname: '',
                age: 0,
            },
        };
    },
    methods: {
        changeInfo() {
            console.log('this.form', this.form);
        },
        logout() {
            window.sessionStorage.clear();
            this.$router.push('/denglu');
        },
    },
};
</script>

<style lang="scss" scoped></style>
